import React, { Component } from 'react'
import { NavBar, WhiteSpace, SearchBar } from "antd-mobile";
import "./components/css/home.less"
import GETnew from './components/getnew/getnew';
import { Getgroupon, Getnew, Getseckill,Getindexgoods } from '../../http/api';
import Wanren from "./components/groupon/groupon"
import Seckill from './components/seckill/seckill';
import Goodslist from "./components/List/List"
import yhq from "../../assets/img/yhq.png"
import yhqlq from "../../assets/img/yhqlq.png"
import home_menu from "../../assets/img/home_menu.png"

export default class home extends Component {
    constructor() {
        super()
        //请求数据
        this.state = {
            getnewlist: [],
            wanrenlist: [],
            seckilllist: [],
            goodslist:[],
            n:0
        }
    }
    async componentDidMount() {
        let res = await Getnew();
        this.setState({
            getnewlist: res.data.list
        })

        let res1 = await Getgroupon();
        this.setState({
            wanrenlist: res1.data.list
        })

        let res2 = await Getseckill();
        this.setState({
            seckilllist: res2.data.list
        })
        let res3 = await Getindexgoods();
        this.setState({
            goodslist:res3.data.list
        })
    }
    // 改变n
    changeN(n) {
        this.setState({
            ...this.state,
            n
        })
    }
    render() {
        let { getnewlist, wanrenlist, seckilllist,goodslist,n } = this.state
        return (
            <div>
                <NavBar>首页</NavBar>

                <SearchBar placeholder="搜索" maxLength={8} />
                <WhiteSpace />

                {getnewlist.length > 0 ? <GETnew getnewlist={getnewlist}></GETnew> : null}

                <div className="yhq">
                    <h3>二重礼</h3>
                    <img className="left" src={yhq} alt="" />
                    <img className="right" src={yhqlq} alt="" />
                </div>
                <div className="home_menu">
                    <img src={home_menu} alt="" />
                </div>

                {wanrenlist.length > 0 ? <Wanren wanrenlist={wanrenlist}></Wanren> : null}

                {seckilllist.length > 0 ? <Seckill seckilllist={seckilllist}></Seckill> : null}

{/* {goodsList.length > 0 ? <Goods goodsList={goodsList[n]} n={n} changeN={(n) => this.changeN(n)} joinshop={(id) => this.joinshop(id)}></Goods> : null} */}

                {goodslist.length>0?(<Goodslist goodslist={goodslist[n]} n={n} changeN={(n)=>this.changeN(n)}></Goodslist>):null}
            </div>
        )
    }
}
